<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
   xmlns:h="http://java.sun.com/jsf/html"
   xmlns:ui="http://java.sun.com/jsf/facelets"
   xmlns:f="http://xmlns.jcp.org/jsf/core"
   xmlns:p="http://primefaces.org/ui">
    <ui:composition template="structpage/templates/defaultLayout.xhtml">
        <ui:define name="title">
            <h:outputText value="ChequeTeatinos"/>
        </ui:define>

        <ui:define name="content"> 
            <h:panelGrid columns="3">
                <h:panelGroup>
                    <img src="resources/media/images/shoppingcart.png" alt="Añadir al carrito" class="iconos" />
                    <span class="order">
                        <span class="details">
                            <p:growl id="messages" showDetail="true" />  
                            <h:form>
                                <p:commandButton rendered="#{loginBean.logged==1}" value="#{msg.addtocart}" action="#{cartBean.addOffertoCart}" />

                                <!-- Si no está logeado -->
                                <p:commandButton rendered="#{loginBean.logged==0}" value="#{msg.addtocart}" actionListener="#{cartBean.logeo}" >
                                    <p:confirm header="Aviso" message="#{msg.needtobelogged}" icon="ui-icon-alert" />  
                                </p:commandButton>
                                <p:confirmDialog global="true" showEffect="fade" hideEffect="explode">
                                    <p:commandButton value="Ok" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>
                                </p:confirmDialog>
                            </h:form>
                        </span>
                    </span>
                </h:panelGroup>
                <h:panelGroup>
                    <img src="resources/media/images/separatorvertical.png"/>
                </h:panelGroup>
                <h:panelGroup>
                    <h:panelGroup layout="block" styleClass="offer">
                        <h:panelGroup>
                            <h2>
                                #{ofertasBean.selectedOffer.nombreOferta}
                            </h2>
                            <br/>
                            <h5>#{ofertasBean.selectedOffer.descripcion}</h5>
                            <h:panelGroup styleClass="order">
                                <h:panelGroup styleClass="price">
                                    #{ofertasBean.selectedOffer.precioConOferta}
                                    <h:panelGroup styleClass="euros">
                                        €
                                    </h:panelGroup>
                                    <h:panelGroup styleClass="before">
                                        #{msg.before} #{ofertasBean.selectedOffer.precioOriginal}
                                        <h:panelGroup styleClass="euros">
                                            €
                                        </h:panelGroup>
                                    </h:panelGroup>
                                </h:panelGroup>
                            </h:panelGroup><br/><br/><br/><br/><br/>    
                            <h6>
                                <h:outputText value="#{msg.left} #{ofertasBean.selectedOffer.existencias} #{msg.units}" />
                            </h6>
                            <h6>
                                <h:outputText value="#{msg.deadline} " />
                                <h:outputText value="#{ofertasBean.selectedOffer.fechaValidez}" >
                                    <f:convertDateTime pattern="dd MMMM yyyy" />
                                </h:outputText>
                            </h6>    

                        </h:panelGroup>               
                    </h:panelGroup>                   
                </h:panelGroup>
            </h:panelGrid>


            <div id="mapa">
            </div>
        </ui:define>
    </ui:composition>
</html>